<div class="box box-primary">
  <div class="box-header with-border">
    <h3 class="box-title">历史交易</h3>
    <button type="button" class="btn btn-primary" (click)="exportData()">导出数据</button>
    <button type="button" class="btn btn-primary">打印本页</button>
    <a class="btn btn-default pull-right fa fa-arrow-left" routerLink="../"
       alt="返回" title="返回"></a>
  </div>
  <div class="box box-body table-responsive no-padding">
    <!--搜索栏区域Begin-->
    <form class="form-inline">
      <div>
        <div class="form-group">
          <label for="fundCodeList">组合名称：</label>
          <select class="form-control ibt-search-input ibt-select2-plugin" id="fundCodeList" name="fundCodeList">
          </select>
        </div>
        <div class="form-group">
          <label for="fundFavoriteTagIdList">个人组合：</label>
          <select class="form-control ibt-search-input ibt-select2-plugin" id="fundFavoriteTagIdList" name="fundFavoriteTagIdList">
          </select>
        </div>
        <div class="form-group">
          <label for="ownContractStatus">本方合同状态：</label>
          <select class="form-control ibt-search-input" name="ownContractStatus" id="ownContractStatus">
            <option value="">全部</option>
            <option value="2">等款</option>
            <option value="2">等券</option>
            <option value="3">券足</option>
            <option value="3">款足</option>
            <option value="8">完成</option>
          </select>
        </div>
        <div class="form-group">
          <label for="oppoContractStatus">对方合同状态：</label>
          <select class="form-control ibt-search-input" name="oppoContractStatus" id="oppoContractStatus">
            <option value="">全部</option>
            <option value="2">等款</option>
            <option value="2">等券</option>
            <option value="3">券足</option>
            <option value="3">款足</option>
            <option value="8">完成</option>
          </select>
        </div>
        <div class="form-group">
          <label for="tradeDate">交易日期：</label>
          <input type="text" class="form-control daterangepicker-plugin ibt-search-input" id="tradeDate">
        </div>
        <div class="form-group">
          <label for="settlementDate">结算日期：</label>
          <input type="text" class="form-control daterangepicker-plugin ibt-search-input" id="settlementDate">
        </div>
        <div class="form-group">
          <label for="oppoHolderAccountList">交易对手：</label>
          <select class="form-control ibt-search-input ibt-select2-plugin" id="oppoHolderAccountList">
          </select>
        </div>
        <div class="form-group">
          <label for="tradeType">业务类型：</label>
          <select class="form-control ibt-search-input" id="tradeType" name="tradeType">
            <option value="">全部</option>
            <option value="3">债券买入</option>
            <option value="4">债券卖出</option>
            <option value="5">融资回购</option>
            <option value="6">融资购回</option>
            <option value="7">融券回购</option>
            <option value="8">融券购回</option>
          </select>
        </div>
        <div class="form-group search-btn-container max">
          <button type="button" class="btn btn-primary" (click)="search()">查询</button>
          <button type="button" class="btn btn-warning" (click)="resetSearch()">重置</button>
        </div>
      </div>
    </form>
    <!--搜索栏区域End-->
    <!--历史交易列表Begin-->
    <interbank-list [data]="data" [fold]="false" [config]="listConfig" [indexOffest]="indexOffest"></interbank-list>
    <!--历史交易列表End-->
    <!--基金交易历史列表分页Begin-->
    <div class="box-footer clearfix">
      <app-pagination
        [currentPageNum]="pageInfo.currentPageNum"
        [pagesShow]="pageInfo.pagesShow"
        [totalPages]="pageInfo.totalPages"
        (pageChanged)="pageNavigation($event)">
        <div class="pull-left pagination-detail" data-pagination-additional="true">
            <span class="pagination-info">
              当前显示第{{pageInfo.startRow}}到第{{pageInfo.endRow}}条&nbsp;&nbsp;&nbsp;&nbsp;总共{{pageInfo.total}}条
            </span>
          <span class="page-list"><span class="btn-group dropup">
              <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                <span class="page-size">{{pageInfo.pageSize}}</span>
                <span class="caret"></span>
              </button>
              <ul class="dropdown-menu" role="menu">
                <li *ngFor="let i of pageInfo.pageList" role="menuitem"
                    [class.active]="pageInfo.pageSize === i"
                    (click)="pageSizeChange(i)">
                  <a href="javascript:void(0)">{{i}}</a>
                </li>
                </ul>
            </span> 条记录每一页</span>
        </div>
      </app-pagination>
    </div>
    <!--基金交易历史列表分页End-->
  </div>
</div>


